<include file="Base/header" /> 
<div class="page-container">
	<include file="Base/menu" /> 
	<div class="page-content">
		<div class="container-fluid">
			<div class="row-fluid">
					<div class="span12"> 
						<!-- BEGIN PAGE TITLE & BREADCRUMB-->
						<h3 class="page-title">
						</h3>
						<ul class="breadcrumb">
							<li>
								<i class="icon-home"></i>
								<a href="/index.php/Admin/">首页</a> 
								<i class="icon-angle-right"></i>
							</li>
							<li><a href="/index.php/Admin/Other">系统设置</a></li>
						</ul>
						<!-- END PAGE TITLE & BREADCRUMB-->
					</div>
			</div>
			<div class="row-fluid">
					<div class="span12">
						<!-- BEGIN EXAMPLE TABLE PORTLET-->
						<div class="portlet box blue">
							<div class="portlet-title">
								<div class="caption"><i class="icon-globe"></i>趋势图</div>
								<div class="tools">
									<a href="javascript:;" class="collapse"></a>
									<a href="javascript:;" class="reload"></a>
									<a href="javascript:;" class="remove"></a>
								</div>
							</div>
							<div class="portlet-body">
								<!-- <div class="clearfix">
                                    <div class="btn-group">
                                        <a href="__CONTROLLER__/DeviceAdd"><button id="sample_editable_1_new" class="btn green">
                                        新增&nbsp;&nbsp;<i class="icon-plus"></i>
                                        </button></a>
                                    </div>
                                </div> -->
                                <div id="sample_1_wrapper" class="dataTables_wrapper form-inline" role="grid">
                                <div class="row-fluid">
                                    <form method="get" action="__URL__/MouseIron" >
                                    <div class="span6">
                                        <div id="sample_1_length" class="dataTables_length">
                                            <select size="1" id="mySelect" name="page_size" aria-controls="sample_1" class="m-wrap small" onchange="submit(this.value)">
                                                <option id="page10" value="10">10</option>
                                                <option id="page20" value="20">20</option>
                                                <option id="page50" value="50">50</option>
                                                <!-- <option id="page100" value="100">100</option> -->
                                            </select> 条/每页</label>
                                        </div>
                                    </div>
                                    <div class="span6">
                                        <div class="dataTables_filter" id="sample_1_filter">
                                            <label>
                                                <input class="m-wrap medium" value="{$begin_time|default=''|date='Y-m-d',###}" name="begin_time" placeholder="开始日" onclick="laydate()">
                                                <input class="m-wrap medium" value="{$end_time|default=''|date='Y-m-d',###}" name="end_time" placeholder="截止日" onclick="laydate()">
                                                <button onclick="shousuos()" class="green">搜索</button>
                                            </label>
                                        </div>
                                    </div>
                                    </form>
                                </div>
								<div id="sample_1_wrapper" class="dataTables_wrapper form-inline" role="grid">
									<div class="row-fluid">
										<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
                                        <div style="height:25px;"></div>
                                        <div class="dataTables_length" id="sample_1_length">
                                            <label>
                                                <input placeholder="总结：" id="search" name="user_name" type="text" class="m-wrap medium">
                                                <button onclick="shousuo()" class="btn green">搜索&nbsp;&nbsp;<i class="icon-plus"></i></button>
                                            </label>
                                        </div>
                                        <div class="controls">
                                            <textarea class="span10 m-wrap" rows="3" id="buttons">总结:</textarea>
                                        </div>
<div class="row-fluid">
    <div class="span6">
        <div class="dataTables_info" id="sample_1_info">
          共{$count}条数据记录。
        </div>
    </div>
    <div class="span6">
        <div class="dataTables_paginate paging_bootstrap pagination">
            {$page}
        </div>
    </div>
</div> 
									</div>
								</div>
							</div>
						</div>
						<!-- END EXAMPLE TABLE PORTLET-->
					</div>
				</div>
		</div>
	</div>
</div>
<include file="Base/footer" /> 
<script src="http://cdn.hcharts.cn/highcharts/highcharts.js"></script>
<script src="http://cdn.hcharts.cn/highstock/highstock.js"></script>
<script src="http://cdn.hcharts.cn/highmaps/highmaps.js"></script>
<script src="__PUBLIC__/plugins/layer/layer.min.js"></script>
<script src="__PUBLIC__/js/layer/laydate/laydate.js"></script>
<script type="text/javascript">
function shousuo(id){
    keywords = $("#search").val();
    layer.open({
        type: 2,
        area: ['1000px', '700px'],
        fixed: false, //不固定
        maxmin: true,
        content: "__MODULE__/Search/index/keywords/"+keywords,
    });
}

</script>

<script type="text/javascript">
 
$(function () {
    Highcharts.chart('container', {
        chart: {
            type: 'line'
        },
        title: {
            text: '213'
        },
        subtitle: {
            text: 'zm-idea.com'
        },
        xAxis: {
            // categories: [<volist name="arr" id="vol">{$vol},</volist>] // 标签循环也是可以的
            categories: {$data}
        },
        yAxis: {
            title: {
                text: '数量'
            }
        },
        plotOptions: {
            line: {
                dataLabels: {
                    enabled: true
                },
                enableMouseTracking: false
            }
        },
        series: [{
            name: '小家鼠',
            // data: [<volist name="arr1" id="vol">{$vol},</volist>]
            data: {$list}
        }, {
            name: '褐家鼠',
            data: [3,2,1]
        },{
            name: '黄胸鼠',
            data: [1,2,4]
        },]
    });
});

/**
 * @license Highcharts JS v5.0.6 (2016-12-07)
 *
 * (c) 2009-2016 Torstein Honsi
 *
 * License: www.highcharts.com/license
 */
(function(factory) {
    if (typeof module === 'object' && module.exports) {
        module.exports = factory;
    } else {
        factory(Highcharts);
    }
}(function(Highcharts) {
    (function(Highcharts) {
        /**
         * (c) 2010-2016 Torstein Honsi
         *
         * License: www.highcharts.com/license
         * 
         * Sand-Signika theme for Highcharts JS
         * @author Torstein Honsi
         */

        'use strict';
        /* global document */
        // Load the fonts
        Highcharts.createElement('link', {
            href: 'https://fonts.googleapis.com/css?family=Signika:400,700',
            rel: 'stylesheet',
            type: 'text/css'
        }, null, document.getElementsByTagName('head')[0]);

        // Add the background image to the container
        Highcharts.wrap(Highcharts.Chart.prototype, 'getContainer', function(proceed) {
            proceed.call(this);
            this.container.style.background = 'url(http://www.highcharts.com/samples/graphics/sand.png)';
        });


        Highcharts.theme = {
            colors: ['#f45b5b', '#8085e9', '#8d4654', '#7798BF', '#aaeeee', '#ff0066', '#eeaaee',
                '#55BF3B', '#DF5353', '#7798BF', '#aaeeee'
            ],
            chart: {
                backgroundColor: null,
                style: {
                    fontFamily: 'Signika, serif'
                }
            },
            title: {
                style: {
                    color: 'black',
                    fontSize: '16px',
                    fontWeight: 'bold'
                }
            },
            subtitle: {
                style: {
                    color: 'black'
                }
            },
            tooltip: {
                borderWidth: 0
            },
            legend: {
                itemStyle: {
                    fontWeight: 'bold',
                    fontSize: '13px'
                }
            },
            xAxis: {
                labels: {
                    style: {
                        color: '#6e6e70'
                    }
                }
            },
            yAxis: {
                labels: {
                    style: {
                        color: '#6e6e70'
                    }
                }
            },
            plotOptions: {
                series: {
                    shadow: true
                },
                candlestick: {
                    lineColor: '#404048'
                },
                map: {
                    shadow: false
                }
            },

            // Highstock specific
            navigator: {
                xAxis: {
                    gridLineColor: '#D0D0D8'
                }
            },
            rangeSelector: {
                buttonTheme: {
                    fill: 'white',
                    stroke: '#C0C0C8',
                    'stroke-width': 1,
                    states: {
                        select: {
                            fill: '#D0D0D8'
                        }
                    }
                }
            },
            scrollbar: {
                trackBorderColor: '#C0C0C8'
            },

            // General
            background2: '#E0E0E8'

        };

        // Apply the theme
        Highcharts.setOptions(Highcharts.theme);

    }(Highcharts));
}));
</script>
